<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
	<meta name="format-detection" content="telephone=no" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta name="apple-touch-fullscreen" content="yes">
	<meta content="telephone=no,email=no" name="format-detection" />
	<meta name="flexible" content="initial-dpr=2,maximum-dpr=3" />
	<!--去缓存-->
	<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
	<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
	<META HTTP-EQUIV="Expires" CONTENT="0"><!--end-->
	<title>羊仓健康生活家</title>
	<link rel="stylesheet" href="css/refund.css" />
	<link rel="stylesheet" href="css/style.css" />
	<script type="text/javascript" src="js/jquery.min.js" ></script>
	<script type="text/javascript" src="js/flexible.js" ></script>
	<script type="text/javascript" src="js/basePathUtil.js" ></script>
	<!--货币格式化-->
	<script type="text/javascript" src="js/jquery-formatcurrency/jquery.formatCurrency.js" ></script>
	<!--弹出-->
	<script type="text/javascript" src="js/layer-mobile/layer.js" ></script>
	<script type="text/javascript">
		var basePath=basePath();
		var access_token = GetUrl("access_token");
	</script>
</head>
<body style="background: #f2f2f2;">
	<div class="warp">
		<!--头部-->
		<div class="topTitle">
			<a class="topReturn" onclick="goBack()">
				<img src="img/baxk.png">
			</a>
			<p class="title">申请退款</p>
		</div>
		<div class="content" id="content">
			<!--<div class="order">-->
				<!--<p class="ordernumber">订单编号 : <span> 00000</span></p>-->
			<!--</div>-->
			<!--&lt;!&ndash;订单内容&ndash;&gt;-->
			<!--<ul class="ulli">-->
				<!--<li>-->
					<!--<div class="licont">-->
						<!--<div class="lijpg">-->
							<!--<img src="../../../../../target/yangcangclub-api/yangcangclub/res/img/06.png">-->
						<!--</div>-->
						<!--<div class="litxt">-->
							<!--<p class="txt1">珍惜天地天然营养富硒鸡蛋 年卡 30枚/每月*12</p>-->
							<!--<p class="txt2">￥2376.00</p>-->
							<!--<p class="txt3">X<span>3</span></p>-->
						<!--</div>-->
					<!--</div>-->
				<!--</li>-->
				<!--<li>-->
					<!--<div class="licont">-->
						<!--<div class="lijpg">-->
							<!--<img src="../../../../../target/yangcangclub-api/yangcangclub/res/img/06.png">-->
						<!--</div>-->
						<!--<div class="litxt">-->
							<!--<p class="txt1">珍惜天地天然营养富硒鸡蛋 年卡 30枚/每月*12</p>-->
							<!--<p class="txt2">￥2376.00</p>-->
							<!--<p class="txt3">X<span>3</span></p>-->
						<!--</div>-->
					<!--</div>-->
				<!--</li>-->
			<!--</ul>-->
		</div>
		<!--退款形式-->
		<ul class="refund">
			<li>
				<p>退款形式 : <span>整单退</span></p>
			</li>
			<li>
				<p>退款金额 : <span style="color:#007234" id="applyRefundPrice"></span></p>
			</li>
		</ul>
		<!--退款原因-->
		<ul class="reason">
			<li id="reasonno">
				<p>退款原因 : <span><input type="text" class="txt" id="reasontxt" placeholder="不想要了"/></span></p>
			</li>
			<li>
				<p>退款说明 : <span><input type="text" class="txt" id="explain" placeholder="选填"/></span></p>
			</li>
		</ul>
		<!--底部-->
		<div class="footer">
			<input type="hidden" id="updateApplyRefundPrice">
			<input type="hidden" id="updateApplyRefundReasonType" value="0">
			<input type="hidden" id="tradeId">
			<input type="hidden" id="refundType" value="F">
			<button onclick="applyRefund()">提交</button>
		</div>
	</div>
	<!--遮罩层-->
	<div class="back" style="display: none;">
		<div class="backcont">
			<div class="backtit">
				<p>退款原因</p>
			</div>
			<ul class="backul">
				<li>
					<div class="backli">
						<p>不想要了</p><input class="applyRefundReasonType" type="hidden" value="1">
						<div class="backright">
							<div class="boradiu"></div>
							<div class="left-jpg">
								<img src="img/good.png">
							</div>
						</div>

					</div>
				</li>
				<li>
					<div class="backli">
						<p>重复下单</p><input class="applyRefundReasonType" type="hidden" value="2">
						<div class="backright">
							<div class="boradiu"></div>
							<div class="left-jpg">
								<img src="img/good.png">
							</div>
						</div>

					</div>
				</li>
				<li>
					<div class="backli">
						<p>其他</p><input class="applyRefundReasonType" type="hidden" value="3">
						<div class="backright">
							<div class="boradiu"></div>
							<div class="left-jpg">
								<img src="img/good.png">
							</div>
						</div>

					</div>
				</li>
			</ul>
			<!--<div id="backbtn">-->
				<!--<button>确定</button>-->
			<!--</div>-->
		</div>
	</div>
</body>
<script>
	$(function(){
		$('#reasonno').click(function(){
			$('.back').css('display','block');
		});

		$('.backli').click(function(){
			$('.backli').find(".left-jpg").css("display","");
			$(this).find(".left-jpg").css("display","block");
			$('#updateApplyRefundReasonType').val($(this).find("input").val());
			$('#reasontxt').val($(this).find("p").text());
			$('.back').css('display','none');

		});
//		$('.backright').click(function(){
//			if($(this).children(1).toggle()){
//				$('#backbtn').click(function(){
//					$('.back').css('display','none');
//					var _html = $('.backli').children(0).html()
////						console.info(_html)
//						$('#reasontxt').val(_html)
//
//				})
//			}
//		});

	})
</script>
<script>
	function goBack() {
		window.location.href= basePath+"res/orderList.html?access_token="+access_token+"&status=D&t="+new Date().getTime();
	}
	function applyRefund() {
		var id = $("#tradeId").val();
		var applyRefundPrice = $("#updateApplyRefundPrice").val();
		var refundReasonType = $("#updateApplyRefundReasonType").val();
		var reason = $("#reasontxt").val();
		if(id=="" || id=="null" || id==null || id<1){
			layer.open({content: '订单不存在',skin: 'msg',time: 2});return;
		}
		if(applyRefundPrice=="" || applyRefundPrice=="null" || applyRefundPrice==null){
			layer.open({content: '申请退款金额错误',skin: 'msg',time: 2});return;
		}
		if(refundReasonType==0){
			layer.open({content: '请选择退款原因',skin: 'msg',time: 2});return;
		}
		$.ajax({
			type:"POST",
			url:basePath+"/v1/refund/api/apply?access_token="+access_token,
			dataType : 'json',
			data:{
				tradeId:id,
				refundType:$("#refundType").val(),
				applyRefundPrice:applyRefundPrice,
				applyRefundReasonType:refundReasonType,
				applyRefundReason:$("#explain").val()

			},
			success:function(data){
				if(data.code==1000) {
					layer.open({
						content: '您申请已提交成功，羊仓3-5个工作日为您处理！',
						btn: '我知道了',
						shadeClose:false,
						yes:function () {
							goBack();
						}
					});
				}else{
					layer.open({content: data.msg,skin: 'msg',time: 2});
				}
			},
			error:function(data) {
			}
		});
	}
	function item(trade,productList) {
		var item = '';
		item+='<div class="order">';
		item+='<p class="ordernumber">订单编号: <span>'+trade.tradeNo+'</span></p>';
		item+='</div>';
		item+='<ul class="ulli">';
		$.each(productList, function(index, content){
			item+='<li>';
			item+='<div class="licont">';
			item+='<div class="lijpg">';
			item+='<img src="'+productList[index].productUrl+'">';
			item+='</div>';
			item+='<div class="litxt">';
			item+='<p class="txt1">'+productList[index].productName+'</p>';
			item+='<p class="txt2">'+$.getFormattedCurrency(productList[index].unitPrice)+'</p>';
			item+='<p class="txt3">x<span>'+productList[index].quality+'</span></p>';
			item+='</div>';
			item+='</div>';
			item+='</li>';
		});
		item+='</ul>';
		$("#content").append(item);
		$("#applyRefundPrice").text($.getFormattedCurrency(trade.realPrice));
		$("#updateApplyRefundPrice").val(trade.realPrice);
		$("#tradeId").val(trade.id);

	}
	function tradeDetailShow(id){
		$("#content").html('');
		if(id=="" || id=="null" || id==null || id<1){
			layer.open({content: '订单不存在',skin: 'msg',time: 2});return;
		}
		$.ajax({
			type:"GET",
			url:basePath+"/v1/trade/api/showTrade?access_token="+access_token,
			dataType : 'json',
			data:{
				tradeId:id
			},
			success:function(data){
				if(data.code==1000) {
					item(data.data.tradeSummary,data.data.tradeDetailsList);
				}else{
					layer.open({content: data.msg,skin: 'msg',time: 2});
				}
			},
			error:function(data) {
			}
		});
	}
	tradeDetailShow(GetUrl("tradeId"));
</script>
</html>
